<template>
  <Card title="研究报告" class="report">
    <div class="top">
      <div class="top-info">
        <div class="title">中国人工智能成熟度模型报告</div>
        <p>
          该报告基干技术家利数里、技术发展时间、技术舆论指数等核心指标，综合市场规模与融资事件等公开资料，
          通过谈判专家访谈与数据分析，全面评估了中国人工智能技术的成熟度报告将人工技术分为前沿技术、早期推广技术、准成熟技术、成熟技术
          四大阶段，并深入分析了各阶段的技术特点、发展趋势及面临的挑战。该报告为行业内外提供了详细的数据支持和趋势洞察，对于推动中国人工智能技术持续
          健康发展有重要意义。
        </p>
      </div>
      <div class="img"></div>
    </div>

    <div class="info">
      <p><span>大语言模型综合能力测评报告 </span><span>2024-08-01</span></p>
      <p><span>中国人工智能成熟度模型报告 </span><span>2024-07-31</span></p>
      <p><span>金融业数字化转型研究报告</span><span>2024-07-31</span></p>
      <p><span>中国AGI市场发展研究报告 </span><span>2024-07-31</span></p>
      <p><span>大语言模型综合能力测评报 </span><span>2024-07-31</span></p>
    </div>
  </Card>
</template>

<script setup lang="ts">
import Card from './Card.vue'
</script>

<style lang="less" scoped>
.report {
  display: flex;
  flex-direction: column;
  font-size: 14px;
  .top {
    flex: 1.2;
    display: flex;
    column-gap: 30px;
    .top-info {
      flex: 1;
      .title {
        font-size: 16px;
        font-weight: bold;
      }
    }
    .img {
      width: 200px;
      background-image: url('../../assets/PQRSTUVWXYZ.png');
      background-repeat: no-repeat;
      background-size: contain;
    }
  }
  .info {
    flex: 1;
    p {
      display: flex;
      justify-content: space-between;
      padding: 5px 0;
      span {
        font-weight: bold;
        color: #68696d;
        letter-spacing: 1px;
      }
      span:nth-of-type(2) {
        color: #9a9ca2;
        letter-spacing: normal;
      }
    }
  }
}
</style>
